<div class="container">
    <!-- bower:css -->
    <link rel="stylesheet" href="../static/admin/bower_components/bootstrap/dist/css/bootstrap.css"/>
    <link rel="stylesheet" href="../static/admin/bower_components/codemirror/lib/codemirror.css"/>
    <link rel="stylesheet" href="../static/admin/bower_components/hotbox/hotbox.css"/>
    <link rel="stylesheet" href="../static/admin/bower_components/kityminder-core/dist/kityminder.core.css"/>
    <link rel="stylesheet" href="../static/admin/bower_components/color-picker/dist/color-picker.min.css"/>
    <!-- endbower -->

    <link rel="stylesheet" href="../static/admin/css/kityminder.editor.min.css">
    <style>
        html, body {
            margin: 0;
            padding: 0;
            height: 100%;
            overflow: hidden;
        }

        h1.editor-title {
            background: #393F4F;
            color: white;
            margin: 0;
            height: 40px;
            font-size: 14px;
            line-height: 40px;
            font-family: \ Hiragino Sans GB\ , \ Arial\ , \ Microsoft Yahei\ ;
            font-weight: normal;
            padding: 0 20px;
        }

        div.minder-editor-container {
            position: absolute;
            top: 40px;
            bottom: 0;
            left: 0;
            right: 0;
        }
    </style>

    <h1 class="editor-title">

        KityMinder Editor - Powered By FEX

        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
                aria-expanded="false">
            Submit <span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
            <li style="color:black" id="subweb"><a href="#">Web</a></li>
            <li style="color:black" id="subfpga"><a href="#">Fpga</a></li>
            <li style="color:black" id="subalgorithm"><a href="#">Algorithm</a></li>
        </ul>


    </h1>

    <kityminder-editor on-init="initEditor(editor, minder)" data-theme="fresh-green"></kityminder-editor>
    <iframe name="frameFile" style="display:none;"></iframe>


    <!-- bower:js -->
    <script src="../static/admin/bower_components/jquery/dist/jquery.js"></script>
    <script src="../static/admin/bower_components/bootstrap/dist/js/bootstrap.js"></script>
    <script src="../static/admin/bower_components/angular/angular.js"></script>
    <script src="../static/admin/bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
    <script src="../static/admin/bower_components/codemirror/lib/codemirror.js"></script>
    <script src="../static/admin/bower_components/codemirror/mode/xml/xml.js"></script>
    <script src="../static/admin/bower_components/codemirror/mode/javascript/javascript.js"></script>
    <script src="../static/admin/bower_components/codemirror/mode/css/css.js"></script>
    <script src="../static/admin/bower_components/codemirror/mode/htmlmixed/htmlmixed.js"></script>
    <script src="../static/admin/bower_components/codemirror/mode/markdown/markdown.js"></script>
    <script src="../static/admin/bower_components/codemirror/addon/mode/overlay.js"></script>
    <script src="../static/admin/bower_components/codemirror/mode/gfm/gfm.js"></script>
    <script src="../static/admin/bower_components/angular-ui-codemirror/ui-codemirror.js"></script>
    <script src="../static/admin/bower_components/marked/lib/marked.js"></script>
    <script src="../static/admin/bower_components/kity/dist/kity.min.js"></script>
    <script src="../static/admin/bower_components/hotbox/hotbox.js"></script>
    <script src="../static/admin/bower_components/json-diff/json-diff.js"></script>
    <script src="../static/admin/bower_components/kityminder-core/dist/kityminder.core.min.js"></script>
    <script src="../static/admin/bower_components/color-picker/dist/color-picker.min.js"></script>
    <!-- endbower -->

    <script src="../static/admin/js/kityminder.editor.min.js"></script>
    <script>
        $("#subweb").click(function () {
            $.post("/api/submitMinder/web_article", {"content": JSON.stringify(editor.minder.exportJson())})
        })
        $("#subfpga").click(function () {
            $.post("/api/submitMinder/fpga_article", {"content": JSON.stringify(editor.minder.exportJson())})
        })
        $("#subalgorithm").click(function () {
            $.post("/api/submitMinder/algorithm_article", {"content": JSON.stringify(editor.minder.exportJson())})
        })
    </script>

    <script>
        angular.module('kityminderDemo', ['kityminderEditor'])
            .controller('MainController', function ($scope) {
                $scope.initEditor = function (editor, minder) {
                    window.editor = editor;
                    window.minder = minder;
                };
            });
    </script>
</div> <!-- /container -->